@font-face {
    font-family: 'robotolight';
    src: url('../fonts/Roboto-Light-webfont.eot');
    src: url('../fonts/Roboto-Light-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/Roboto-Light-webfont.woff') format('woff'),
         url('../fonts/Roboto-Light-webfont.ttf') format('truetype'),
         url('../fonts/Roboto-Light-webfont.svg#robotolight') format('svg');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'robotoregular';
    src: url('../fonts/Roboto-Regular-webfont.eot');
    src: url('../fonts/Roboto-Regular-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/Roboto-Regular-webfont.woff') format('woff'),
         url('../fonts/Roboto-Regular-webfont.ttf') format('truetype'),
         url('../fonts/Roboto-Regular-webfont.svg#robotoregular') format('svg');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'robotobold';
    src: url('../fonts/Roboto-Bold-webfont.eot');
    src: url('../fonts/Roboto-Bold-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/Roboto-Bold-webfont.woff') format('woff'),
         url('../fonts/Roboto-Bold-webfont.ttf') format('truetype'),
         url('../fonts/Roboto-Bold-webfont.svg#robotobold') format('svg');
    font-weight: normal;
    font-style: normal;

}





$body-color:		#777;


$heading-color:		#555;


$accent:			#6cc0f7;
$black:				#000;
$white:				#fff;
$light-bg:			#e9e9e9;
$dark-bg:           #5f6d7e;
$border-color:      #dddddd;
$light-color:       #999;


$phone:				768px;
$tablet:			992px;
$desktop:			1200px;





@mixin transition($transition-property, $transition-time, $method) {
    -webkit-transition: $transition-property $transition-time $method;
    -moz-transition: $transition-property $transition-time $method;
    -ms-transition: $transition-property $transition-time $method;
    -o-transition: $transition-property $transition-time $method;
    transition: $transition-property $transition-time $method;
}


@mixin border-radius($radius) {
	-webkit-border-radius: $radius;
	border-radius: $radius;
}

@mixin media( $query: $feature $value ) {
	@if length($query) == 1 {
		@media screen and ($default-feature: nth($query, 1)) {
			@content;
		}
	}

	@else if length($query) == 2 {
		@media screen and (nth($query, 1): nth($query, 2)) {
			@content;
		}
	}

	@else if length($query) == 4 {
		@media screen and (nth($query, 1): nth($query, 2)) and (nth($query, 3): nth($query, 4)) {
			@content;
		}
	}

	@else {
		@warn "Wrong number of arguments for breakpoint(). Read the documentation for more details.";
	}
}


%clearfix {
  &:after {
    content: "";
    display: table;
    clear: both;
  }
}
